<!DOCTYPE HTML>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<html lang="zxx" class="no-js">

<head>
    <title>Home</title>
    <!-- Meta tag Keywords -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta charset="UTF-8" />
    <meta name="keywords" content=""
    />
    <script>
        addEventListener("load", function () {
            setTimeout(hideURLbar, 0);
        }, false);

        function hideURLbar() {
            window.scrollTo(0, 1);
        }
    </script>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="shortcut icon" type="image/x-icon" href="css/img/favicon.png">
    <link rel="stylesheet" href="css/fonts/font-awesome/css/font-awesome.min.css">
    <!-- Place favicon.ico in the root directory -->

    <!-- CSS here -->
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/animate.min.css">
    <link rel="stylesheet" href="css/magnific-popup.css">
    <link rel="stylesheet" href="css/fontawesome-all.min.css">
    <link rel="stylesheet" href="css/owl.carousel.min.css">
    <link rel="stylesheet" href="css/jquery-ui.min.css">
    <link rel="stylesheet" href="css/flaticon.css">
    <link rel="stylesheet" href="css/odometer.css">
    <link rel="stylesheet" href="css/aos.css">
    <link rel="stylesheet" href="css/slick.css">
    <link rel="stylesheet" href="css/default.css">
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="css/responsive.css">
    <!-- Meta tag Keywords -->
    <!-- css files -->
    <link rel="stylesheet" href="css/loginstyle.css" type="text/css" media="all" />
    <!-- Style-CSS -->
    <link rel="stylesheet" href="css/fontawesome-all.css">
    <!-- Font-Awesome-Icons-CSS -->
    <!-- //css files -->
    <!-- web-fonts -->
    <link href="http://maxcdn.bootstrapcdn.com/css?family=Josefin+Sans:100,100i,300,300i,400,400i,600,600i,700,700i" rel="stylesheet">
    <link href="http://maxcdn.bootstrapcdn.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i" rel="stylesheet">
    <!-- //web-fonts -->
    <style>
        #weixin_hover {
            position: relative;
        }
        #weixin_img{
            z-index: 9999;
            display: none;
            position:absolute;
            left: 50%;
            margin-left: -100px;
            margin-top: -2px;
            width: 100px;
            height: 1000%;
        }
        #weixin_hover:hover #weixin_img{
            display: block;
        }
    </style>
</head>

<body>


<!-- preloader  -->
<div id="preloader">
    <div id="ctn-preloader" class="ctn-preloader">
        <div class="animation-preloader">
            <div class="spinner"></div>
            <div class="txt-loading">
                        <span data-text-preloader="E" class="letters-loading">
                            E
                        </span>
                <span data-text-preloader="D" class="letters-loading">
                            D
                        </span>
                <span data-text-preloader="S" class="letters-loading">
                            S
                        </span>
                <span data-text-preloader="T" class="letters-loading">
                            T
                        </span>
                <span data-text-preloader="U" class="letters-loading">
                            U
                        </span>
                <span data-text-preloader="D" class="letters-loading">
                            D
                        </span>
                <span data-text-preloader="Y" class="letters-loading">
                            Y
                        </span>
            </div>
        </div>
        <div class="loader">
            <div class="row">
                <div class="col-3 loader-section section-left">
                    <div class="bg"></div>
                </div>
                <div class="col-3 loader-section section-left">
                    <div class="bg"></div>
                </div>
                <div class="col-3 loader-section section-right">
                    <div class="bg"></div>
                </div>
                <div class="col-3 loader-section section-right">
                    <div class="bg"></div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- preloader end -->


<!-- Scroll-top -->
<button class="scroll-top scroll-to-target" data-target="html">
    <i class="fas fa-angle-up"></i>
</button>
<!-- Scroll-top-end-->


<!-- 头部 -->
<header>
    <div class="header-top-wrap d-none d-md-block">
        <div class="container-fluid container-full">
            <div class="row align-items-center">
                <div class="col-lg-6 col-md-6">
                    <div class="d-flex align-items-center">
                        <div class="header-top-library">
                            <a href="#">图书馆<i class="fas fa-angle-down"></i></a>
                        </div>
                        <div class="header-top-search">
                            <form action="#">
                                <input type="text" placeholder="搜索...">
                                <button><i class="fas fa-search"></i></button>
                            </form>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6 col-md-6">
                    <div class="header-right-list">
                        <div class="header-top-social">
                            <ul>
                                <li>联系我们</li>
                                <li><a href="#"><i class="fab fa-twitter"></i></a></li>
                                <li>
                                    <a href="#"><i class="fab fa-weibo"></i> </a></li>
                                <li><a href="tencent://message/?uin=1092535160&Menu=yes& Service=300&sigT=42a1e5347953b64c5ff3980f8a6e644d4b31456cb0b6ac6b27663a3c4dd0f4aa14a543b1716f9d45"><i class="fab fa-qq"></i></a></li>
                                <li id="weixin_hover" ><a href="#"><i class="fab fa-weixin"></i>
                                    <ul>
                                        <img class="qrcode" id="weixin_img"  src="css/img/product/wx_01.png" alt="wx:K15035689083"/>
                                    </ul>
                                </a></li>
                            </ul>
                        </div>
                        <div class="header-user-login">
                            <a href="index.html"><i class="fas fa-home"></i>首页</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- bg effect -->
    <div id="bg">
        <canvas></canvas>
        <canvas></canvas>
        <canvas></canvas>
    </div>
    <!-- //bg effect -->
    <!-- title -->
    <h1 th:text="${sendMailMsg1}" style="color: white" align="center"></h1>
    <!-- //title -->
    <!-- content -->
    <div class="sub-main-w3">

        <form th:action="@{/loginTo}" method="get" id="form">
            <!-- <h2>现在登录
                <i class="fas fa-level-down-alt"></i>
            </h2> -->
            <div class="form-style-agile">
                <label style="color: #fff;">
                    <i class="fas fa-user"></i>
                    用户名
                </label>
                <input placeholder="用户名" name="account" class="info" type="text" required="" id="name">
            </div>
            <div class="form-style-agile">
                <label style="color: #fff;">
                    <i class="fas fa-unlock-alt"></i>
                    密码
                </label>
                <input placeholder="密码" name="password" class="info" type="password" required="" id="pwd">
                <!--如果msg的值为空则不显示消息-->
                <p id="ss" style="color: red" th:text="${msg}" th:if="${not #strings.isEmpty(msg)}"></p>
                <span style="color: red" ></span>
            </div>
            <!-- checkbox -->
            <div class="wthree-text">
                <ul>
                    <li>
                        <label class="anim">
                            <input type="checkbox" class="checkbox" required="">
                            <span>保持登录</span>
                        </label>
                    </li>
                    <li>
                        <a th:href="@{/forgotPwdUI}">忘记密码?</a>
                    </li>
                </ul>
            </div>
            <!-- //checkbox -->
            <input type="submit" value="登录" id="b1">
        </form>
    </div>
    <!-- //content -->

    <!-- copyright -->
    <div class="footer">
        <p>Copyright © 2020.Company name All rights reserved.<a target="_blank" href="http://sc.chinaz.com/moban/">多元合创</a></p>
    </div>

    <!-- //copyright -->

    <!-- Jquery -->
    <script src="css/js/jquery-3.3.1.min.js"></script>
    <!-- //Jquery -->

    <!-- effect js -->
    <script src="css/js/canva_moving_effect.js"></script>
    <!-- //effect js -->
    <script src="css/js/vendor/jquery-3.5.0.min.js"></script>
    <script src="css/js/popper.min.js"></script>
    <script src="css/js/bootstrap.min.js"></script>
    <script src="css/js/isotope.pkgd.min.js"></script>
    <script src="css/js/imagesloaded.pkgd.min.js"></script>
    <script src="css/js/jquery.magnific-popup.min.js"></script>
    <script src="css/js/owl.carousel.min.js"></script>
    <script src="css/js/jquery.odometer.min.js"></script>
    <script src="css/js/jquery-ui.min.js"></script>
    <script src="css/js/jquery.appear.js"></script>
    <script src="css/js/slick.min.js"></script>
    <script src="css/js/ajax-form.js"></script>
    <script src="css/js/wow.min.js"></script>
    <script src="css/js/aos.js"></script>
    <script src="css/js/plugins.js"></script>
    <script src="css/js/main.js"></script>
</header>
</body>

</form>


<script>
    // 按钮绑定点击事件
    $('#b1').click(function () {
        var name=$('#name').val();
        var pwd=$('#pwd').val();
        var sz=/^\d{6}$/;
        if (name!=null && name!="" && pwd!=null && pwd!='')
        {
            $("#form").submit();
        }
        if (name.value==null && name==""){
            $("#ss").val('');
            $("#ss").html("用户名不能为空！");
        }
        if (pwd.value==null && pwd==""){
            $("#ss").html("密码不能为空！");
            $("#ss").val('');
        }

        // if(sz.exec(name))
        // {
        // 	alert("asd2")
        // 	$("#ss").html("用户名格式必须为6为数字！");
        // }

    });
</script>

</html>